<template>
  <el-dialog
    title="请选择问卷所属课程"
    :visible.sync="catalogueVisible"
    :before-close="handleClose"
    width='40%'
  >
    <el-select v-model="value" placeholder="请选择"  @change='courseCheck(value)'>
      <el-option
        v-for='item in courseList'
        :key='item.courseId'
        :label='item.courseName'
        :value='item.courseId'
      ></el-option>
    </el-select>
    <div slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取 消</el-button>
      <el-button type="primary" @click="handleConfirm">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { selectedCoursesList } from "@/api/evaluation/course"
import { getUserTemplate } from '@/api/evaluation/category'
export default {
  name: 'CatalogueDialog',
  props: {
    catalogueVisible: {
      default: false
    },
    projectKey: String
  },
  data () {
    return {
      courseList: [],
      courseId: Number,
      value: '',
    }
  },
  created () {
    // console.log('------', this.projectKey, this.courseId)
    this.getUserCourseList()
  },
  methods: {
    getUserCourseList() {
      selectedCoursesList().then(res => {
        this.courseList = res.data
        console.log('this.courseList', this.courseList)
      })
    },
    handleClose() {
      this.$emit('update:catalogueVisible', false)
    },
    handleConfirm() {
      this.$emit('update:catalogueVisible', false)
        console.log('this-----------courseId',this.courseId)
      getUserTemplate(this.projectKey, this.courseId).then(res => {
        console.log(res)
        this.$router.push({ path: '/edit', query: { projectKey: res.data } })
      })
    },
    courseCheck(value) {
      console.log('gsdufhigjri', value)
      this.courseId = value
    }
  }
}
</script>

<style scoped>
</style>
